import React, { Component } from 'react'

import Test from './components/test'

// 纯组件使用

export default class App extends Component {
  state = {
    count: 0,
    msg:'hello'
  };
  getRandomInt = (min, max) => {
    min = Math.ceil(min);
    max = Math.floor(max);
    return Math.floor(Math.random() * (max - min)) + min; //不含最大值，含最小值
  };

  shouldComponentUpdate(nextprops, nextState) {
    // nextprops父组件传过来的最新props数据
    // this.props表示上一次的props数据
    console.log(this.props, nextprops);
    if (
      this.state.count !== nextState.count ||
      this.state.msg !== nextState.msg
    )
    {  return true;}
    else return false;
  }

  render() {
    console.log("app渲染了");
    return (
      <div>
        <h1>app组件</h1>
        {this.state.count}
        <br />
        {this.state.msg}
        <Test count={this.state.count}></Test>
        <button
          onClick={() => {
            this.setState({
              count: this.getRandomInt(1, 3),
            });
          }}
        >
          按钮
        </button>
        <button
          onClick={() => {
            this.forceUpdate();
          }}
        >
          app强制
        </button>

        <button onClick={() => {
          this.setState({
            msg:'dddd'
          })
        }}>
          改变msg
        </button>
      </div>
    );
  }
}
